<template>
  <el-card class="form-container" shadow="never">
    <el-form
      :model="data"
      ref="dataFrom"
      label-width="150px"
      size="small">
      <el-form-item label="标题：" prop="title">{{ data.title }}
      </el-form-item>
      <el-form-item label="位置：" prop="position">{{ data.position }}
      </el-form-item>
      <el-form-item label="封面：" prop="image">
        <img style="max-width:300px" :src="data.picId"/>
      </el-form-item>
      <el-form-item
        label="正文："
        prop="content"
      >
        <div v-html="data.bestVolunteerDetail&&data.bestVolunteerDetail.volunteerDetail"></div>
      </el-form-item>
      <el-form-item>
        <el-button @click="back">返回</el-button>
      </el-form-item>
    </el-form>
  </el-card>
</template>
<script>
import { bestvolunteerGetById } from '@/api/neighbour'

export default {
  name: 'ReviewBestVolunteers',
  props: {
    isEdit: {
      type: Boolean,
      default: false
    }
  },
  data () {
    return {
      data: {},
      loading: false
    }
  },
  mounted () {
    bestvolunteerGetById({ id: this.$route.query.id }).then(response => {
      const { status, title, position, picId, bestVolunteerDetail } = response.data
      this.data = {
        status,
        title,
        position,
        picId,
        bestVolunteerDetail: bestVolunteerDetail || { volunteerDetail: '' }
      }
    })
  },
  methods: {
    back () {
      this.$router.go(-1)
    }
  }

}
</script>
